<div>
  <div nz-form-item nz-row style="margin-top:15px;margin-bottom:10px;">
    <div nz-col [nzSpan]="6">
      <button nz-button [nzType]="'primary'" [nzSize]="'small'" col-offset-2 (click)="toBack()">
        <i class="anticon anticon-left"></i>
        <span>返回</span>
      </button>
    </div>
  </div>
  <nz-collapseset>
    <nz-collapse [nzTitle]="panels.name" [nzActive]="panels.active" [nzDisabled]="panels.disabled">
      <form nz-form>
        <div nz-form-item nz-row style="margin-bottom: 12px">
          <div nz-form-label nz-col  [nzSpan]="3">
            <label>单位名称</label>
          </div>
          <div nz-form-control nz-col [nzSpan]="4">
            <nz-input [(ngModel)]="trainingPlanDetail.partyName" name="unitName">
            </nz-input>
          </div>
          <div nz-form-label nz-col [nzSpan]="3">
            <label>计划状态</label>
          </div>
          <div nz-form-control nz-col [nzSpan]="4">
            <nz-select style="width: 150px;" nzAllowClear [nzPlaceHolder]="'请选择'" [(ngModel)]="trainingPlanDetail.planStatus"
                       [nzShowSearch]="true" name="checkState">
              <nz-option *ngFor="let option of planStatus" [nzLabel]="option.label" [nzValue]="option.value"></nz-option>
            </nz-select>
          </div>
          <button nz-col [nzSpan]="2" [nzOffset]="2" nz-button  [nzType]="'primary'" (click)="query()">查询</button>
        </div>
        <div nz-form-item nz-row style="margin-bottom: 12px">
          <div nz-form-label nz-col [nzSpan]="3">
            <label>单位管理人员</label>
          </div>
          <div nz-form-control nz-col [nzSpan]="4">
            <nz-input [(ngModel)]="trainingPlanDetail.unitManageUser" name="unitManageUser">
            </nz-input>
          </div>

          <div nz-form-item nz-row>
            <div nz-form-label nz-col [nzSpan]="3">
              <label>实施时间</label>
            </div>
            <div nz-form-control nz-col [nzSpan]="9" >
              <nz-datepicker [nzSize]="'large'" [nzFormat]="'YYYY-MM-DD'" name="startDate" [nzPlaceHolder]="'开始日期'" [(ngModel)]="trainingPlanDetail.startDate"></nz-datepicker>
              至
              <nz-datepicker [nzSize]="'large'" [nzFormat]="'YYYY-MM-DD'" name="endDate" [nzPlaceHolder]="'结束日期'" [(ngModel)]="trainingPlanDetail.endDate"></nz-datepicker>
            </div>
          </div>
        </div>

      </form>
    </nz-collapse>
  </nz-collapseset>

  <ul nz-menu [nzMode]="'horizontal'">
    <li *ngIf="partyType =='4'" nz-menu-item (click)="assignTask()">
      <i class="anticon anticon-plus"></i>下达培训任务</li>
    <li  nz-menu-item (click)="update(title, content, footer)">
      <i class="anticon anticon-copy"></i>修改</li>
    <li *ngIf="partyType =='4'" nz-menu-item (click)="delete()">
      <i class="anticon anticon-delete"></i>删除</li>
    <li *ngIf="partyType =='4'" nz-menu-item (click)="sendTrainingNotice(titleNotice, contentNotice, footerNotice)">
      <i class="anticon anticon-copy"></i>发送培训通知</li>
  </ul>

  <nz-table #nzTable [nzDataSource]="dataList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="displayDataChange($event)">
    <thead nz-thead>
    <tr>
      <th nz-th [nzCheckbox]="true">
        <label nz-checkbox [(ngModel)]="allChecked" [nzIndeterminate]="indeterminate" (ngModelChange)="checkAll($event)">
        </label>
      </th>
      <th nz-th>
        <span>单位名称</span>
      </th>
      <th nz-th>
        <span>单位类型</span>
      </th>
      <th nz-th>
        <span>牵头单位</span>
      </th>
      <th nz-th>
        <span>计划实施时间</span>
      </th>
      <th nz-th>
        <span>单位安全管理人员</span>
      </th>
      <th nz-th>
        <span>计划状态</span>
      </th>
      <th nz-th>
        <span>培训记录</span>
      </th>
      <th nz-th>
        <span>调整实施时间</span>
      </th>
      <th nz-th>
        <span>调整原因</span>
      </th>
    </tr>
    </thead>
    <tbody nz-tbody>
    <tr nz-tbody-tr *ngFor="let data of dataList">
      <td nz-td [nzCheckbox]="true">
        <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="refreshStatus($event)">
        </label>
      </td>
      <td nz-td>{{data.partyName}}</td>
      <td nz-td>{{data.partyType | constantTransfer : partyTypes}}</td>
      <td nz-td>{{data.leadUnit}}</td>
      <td nz-td>{{(data.startDate | dateFormat)}} 至 {{(data.endDate | dateFormat)}}</td>
      <td nz-td>{{data.unitManageUser}}</td>
      <td nz-td>{{data.planStatus | constantTransfer : planStatus}}</td>
      <td nz-td>
        <span>
            <nz-popover [nzTitle]="'请选择'" [nzPlacement]="'bottom'" [nzTrigger]="'click'">
                <div *ngIf="data.trainingPhoto && data.checkInTable && data.summaryStatement">
                  <button  nz-button [nzSize]="'small'" [nzType]="'primary'"  nz-popover>导出</button>
                </div>
               <div *ngIf="!data.trainingPhoto || !data.checkInTable || !data.summaryStatement">
                  <button  nz-button [nzSize]="'small'" [nzType]="'primary'"  disabled = "disabled" nz-popover>导出</button>
                </div>
                <ng-template #nzTemplate>
                    <div>
                        <button nz-button [nzSize]="'small'" (click)="downloadFile(data,1)">培训现场照片</button>
                    </div>
                    <div style="margin-top:10px">
                        <button nz-button [nzSize]="'small'" (click)="downloadFile(data,2)">培训签到表</button>
                    </div>
                    <div style="margin-top:10px">
                        <button nz-button [nzSize]="'small'" (click)="downloadFile(data,3)">考核汇总表</button>
                    </div>
                </ng-template>
            </nz-popover>
        </span>
      </td>
      <td nz-td>{{data.adjustDate | dateFormat}}</td>
      <td nz-td>{{data.adjustReason}}</td>
    </tr>
    </tbody>
  </nz-table>

  <nz-pagination [nzPageIndex]="trainingPlanDetail.currentPage" nzShowTotal [nzTotal]="total" nzShowSizeChanger
                 (nzPageSizeChange)="nzPageSizeChange($event)" (nzPageIndexChange)="nzPageIndexChange($event)"
                 (nzPageIndexClickChange)="nzPageIndexClickChange($event)" [nzPageSize]="trainingPlanDetail.pageSize"></nz-pagination>

  <ng-template #title>
    <span>{{modelTitle}}</span>
  </ng-template>
  <ng-template #content>
    <trainingPlan-detail-update-page *ngIf="modal==1" (outValue)="addCall($event) " [inValue]="updateData"></trainingPlan-detail-update-page>
  </ng-template>
  <ng-template #footer>
    <div>
    </div>
  </ng-template>

  <ng-template #titleNotice>
    <span>发通知</span>
  </ng-template>
  <ng-template #contentNotice>
    <form nz-form>
      <div nz-form-item nz-row>
        <div nz-form-label nz-col [nzSm]="3" [nzXs]="3">
          <label>标题</label>
        </div>
        <div nz-form-control nz-col [nzSm]="9" [nzXs]="9">
          <nz-input [(ngModel)]="sendTitle" name="sendTitle" [nzPlaceHolder]="'请输入标题'"></nz-input>
        </div>
      </div>

      <div nz-form-item nz-row>
        <div nz-form-label nz-col [nzSm]="3" [nzXs]="3">
          <label>内容</label>
        </div>
        <div nz-form-control nz-col [nzSm]="9" [nzXs]="9">
          <nz-input [(ngModel)]="sendContent" name="sendContent" [nzType]="'textarea'" [nzRows]="'5'" [nzPlaceHolder]="'请输入内容'"></nz-input>
        </div>
      </div>

      <div nz-form-item nz-row style="margin-bottom:8px;">
        <div nz-form-control nz-col [nzSpan]="14" [nzOffset]="10">
          <button nz-button (click)="sendMessage()" [nzType]="'primary'">发送</button>
        </div>
      </div>
    </form>

  </ng-template>
  <ng-template #footerNotice>
    <div>
    </div>
  </ng-template>
</div>
